<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
    <title>加盟</title>
    <link rel="stylesheet" href="css/join.css" type="text/css">
</head>
<body>
    <div class="banner-box">
        <img src="img/banner.jpg" class="p-banner" alt="加盟" />
        <img src="img/M/banner.jpg" class="m-banner" alt="加盟" />
    </div>
    <div class="join-bg">
        <div class="join-box">
            <div class="join-content">
                <h3>
                    儿童市场规模
                    <p>MARKET SIZE</p>
                </h3>
                <div class="join-list clearfloat mg-top-20">
                    <div class="join-img fl">
                        <img src="img/join-1.png" />
                    </div>
                    <div class="fr right-video">
                        <span></span><img src="img/join-1-text.png" />
                        <div class="video-box">
                            <img src="img/video-bg.png" />
                            <img src="img/video-off.png" class="video-off" />
                            <p>
                                诗克恰2018春季发布会
                            </p>
                        </div>
                    </div>
                    <img src="img/love-1.png" class="love-1" />
                    <img src="img/love-2.png" class="love-2" />
                </div>
                <p class="botm-border"></p>

                <h3>
                    终端盈利核心竞争力
                    <p>CORE COMPETITIVENSS</p>
                </h3>
                <div class="join-list clearfloat">
                    <div class="join-img fr text-r">
                        <img src="img/join-2.png" />
                    </div>
                    <div class="join-text position-l">
                        <span></span><img src="img/join-2-text.png" />
                    </div>
                    <img src="img/love-3.png" class="love-3" />
                </div>

                <div class="join-list">
                    <div class="join-img">
                        <img src="img/join-3.png" />
                    </div>
                    <div class="join-text position-r">
                        <span></span><img src="img/join-3-text.png" />

                    </div>
                </div>

                <div class="join-list clearfloat">
                    <div class="join-img fr text-r">
                        <img src="img/join-4.png" />
                    </div>
                    <div class="join-text position-l">
                        <span></span><img src="img/join-4-text.png" />
                    </div>
                </div>

                <div class="join-list">
                    <div class="join-img">
                        <img src="img/join-5.png" />
                    </div>
                    <div class="join-text position-r">
                        <span></span><img src="img/join-5-text.png" />
                    </div>
                </div>

                <div class="join-list clearfloat">
                    <div class="join-img fr text-r">
                        <img src="img/join-6.png" />
                    </div>
                    <div class="join-text position-l">
                        <span></span><img src="img/join-6-text.png" />
                    </div>
                </div>

                <div class="join-list">
                    <div class="join-img">
                        <img src="img/join-7.png" />
                    </div>
                    <div class="join-text position-r">
                        <span></span><img src="img/join-7-text.png" />
                    </div>
                    <img src="img/love-4.png" class="love-4" />
                </div>

                <p class="botm-border"></p>

                <h3>
                    支持力度
                    <p>SUPPORT</p>
                </h3>

                <div class="join-list">
                    <img src="img/join-8.png" class="join-8 p-banner" />
                    <img src="img/M/love-1.png" class="m-banner join-8" />
                    <img src="img/love-5.png" class="love-5" />
                </div>

                <p class="botm-border"></p>

                <h3>
                    未来三年发展方向
                    <p>DIRECTION OF DEVELOPMENT</p>
                </h3>

                <div class="direction">
                    <img src="img/join-9.png" class="join-8 p-banner" />
                    <img src="img/M/join-9.png" class="join-8 m-banner" />
                    <button class="direction-bt">
                        立即咨询
                    </button>
                    <img src="img/love-6.png" class="love-6" />
                    <img src="img/love-7.png" class="love-7" />
                </div>
            </div>
        </div>
    </div>
    <div class="video-modal">
        <span></span>
        <iframe frameborder="0" align="middle" src="https://v.qq.com/iframe/player.html?vid=o0618s9dtwb&tiny=0&auto=0" allowfullscreen></iframe>

    <!--<embed src="https://imgcache.qq.com/tencentvideo_v1/playerv3/TPout.swf?max_age=86400&v=20161117&vid=o0618s9dtwb" allowFullScreen="true" quality="high" width="480" height="400" align="middle" allowScriptAccess="always" type="application/x-shockwave-flash"></embed>-->
    </div>
</body>
<script src="js/jquery-2.1.1.min.js"></script>
<script type="text/javascript">
    $(window).load(function() {
        $('.video-off').click(function () {
            $(".video-modal").html('<span></span><iframe frameborder="0" align="middle" src="https://v.qq.com/iframe/player.html?vid=o0618s9dtwb&tiny=0&auto=0" allowfullscreen></iframe>');
            $(".video-modal").show();
        });
        $(".video-modal").bind("click",function(event){
            $(".video-modal").html('');
            $(".video-modal").hide();
        })
        $(".video-modal iframe").bind("click",function(event){
            event.stopPropagation();
        })
    })
</script>
</html>